:root {
    --action: #fec500;
    --bj: #f3f3f3;
    --c333: #333;
    --c999: #999;
    --c666: #666;
    --cfff: #ffffff;
    --c888: #888888;
}
.w1750{
    width: 1750px;
    margin: 0 auto;
}
.w50{
    width: 50%;
}
.hid{
    width: 100%;
    height: 108px;
}
header{
    width: 100%;
    background: url('../images/header-bj.png') no-repeat center;
    background-size: 100% 100%;
    position: fixed;
    top: 33px;
    left: 0;
    z-index: 20;
    transition: all 0.6s ease-in-out
}
.headerd{
    top: -60px !important;
    opacity: 0;
    box-shadow: 0 0 3px rgba(0, 0, 0, 0.1)
}
.casedef-cont-ves .swiper-slide{
    text-align: center
}

.header{
    width: 92%;
    margin: 0 auto;
}
.header h1{
    width: 299px;
    height: auto;
    margin-top: 3px;
}
.header .nav ul{
    display: inline-block;
    vertical-align: middle
}
.header .nav li{
    display: inline-block;
    vertical-align: middle;
    margin-left: 64px;
    font-size: 18px;
    line-height: 75px;
    position: relative;
}
.header .nav li::before{
    content: '';
    width: 0;
    height: 5px;
    background: var(--action);
    display: block;
    position: absolute;
    left: 50%;
    bottom: 0;
    transform: translateX(-50%);
    opacity: 0;
}
.header .nav li.on::before{
    width: 100%;
    opacity: 1;
}
.header .h-ss{
    display: inline-block;
    vertical-align: middle;
    position: relative;
    margin: 0 68px;
    margin-right: 0;
    cursor: pointer;
}
.header .h-ss .btt{
    width: 17px;
    height: 17px;
    background: url('../images/h-ss.png') no-repeat center;
}
.index-set1{
    width: 100%;
    background: #f7f7f7;
    padding: 72px 0 107px;
}
.index-set1-title{
    margin-bottom: 65px;
}
.index-set1-title h6{
    font-size: 18px;
    color: #666;
}
.index-set1-title h6 span{
    font-size: 38px;
    color: #333;
    display: inline-block;
    margin-right: 15px;
}
.index-set1 .swiper-ves{
    position: absolute;
    right: 3%;
    bottom: 20px;
    width: 48%;
    z-index: 3;
}
.index-set1 .swiper-ves .swiper-scroll{
    display: inline-block;
    height: 2px;
    width: 548px;
    /* vertical-align: middle; */
    background: rgba(255, 255, 255, 0.3);
    margin: 0 20px;
    margin-bottom: 8px;
}
.index-set1 .swiper-scrollbar-drag{
    height: 4px;
    top: -1px;
    background: #fff;
}
.index-set1 .swiper-ves span{
    font-size: 32px;
    color: var(--action)
}
.index-set1 .swiper-ves span.tod{
    color: #949392
}
.swiper-ves .tob{
    display: inline-block;
    padding-bottom: 15px;
    vertical-align: middle;
    margin-left: 50px;
}
.swiper-ves .tob span{
    width: 36px;
    height: 36px;
    border-radius: 50%;
    background-color: #fff;
    display: inline-block;
    vertical-align: middle;
    cursor: pointer;
    margin: 0 6px;
    background-image: url('../images/index-set1-ico.png');
    background-repeat: no-repeat;
    background-position: center
}
.swiper-ves .tob span:hover{
    background-color: var(--action)
}
.swiper-ves .tob .prev{
    transform: rotate(180deg)
}
.index-set1-cont li{
    position: relative;
    overflow: hidden;
    border-top-left-radius: 20px;
    border-top-right-radius: 20px
}
.index-set1-po{
    position: absolute;
    bottom: 40px;
    left: 4%;
}
.index-set1-po p{
    color: #f5f5f5;
    font-size: 18px;
}
.index-set1-po h6{
    font-size: 52px;
    color: #fff
}
.index-set2{
    padding: 80px 0;
}
.index-set2-nav{
    text-align: center;
    margin-bottom: 68px;
}
.case-ves .index-set2-nav a:hover{
    color: var(--action);
   
}
.index-set2-nav a{
    display: inline-block;
    line-height: 42px;
    padding: 0px 26px;
    border-radius: 20px;
    font-size: 16px;
    color: #666666;
}
.index-set2-nav a.on{
    background: var(--action);
    color: #1e242b !important;
    font-size: 18px;
    /* font-weight: bold; */
}
.index-set2-page{
    width: 100%;
    display: none;
}
.index-set2-page li{
    width: 24%;
    float: left;
    margin-right: 1.333%;
    text-align: center
}
.index-set2-page li .flash{
    height: 270px;
}
.index-set2-page li .flash img{
    transition: all 0.5s
}
.index-set2-page li .flash:hover img{
    /* transform: scale(1.05) */
}
.index-set2-page li:nth-of-type(4n){
    margin-right: 0;
}
.index-set2-page li h6{
    height:40px;
    line-height:40px;
    font-size: 16px;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 1;
    display: -webkit-box;
    white-space: normal;
    overflow: hidden;
}
.index-set2-page li:hover h6{
    color: var(--action)
}
.index-set3{
    width: 100%;
   
    background: url('../images/index-set3-bj.jpg') no-repeat center;
}
.index-set3-cont{
    position: relative;
}
.index-set3-cont h3{
    position: absolute;
    width: 100%;
    left: 0;
    top: 10%;
    font-size: 36px;
    color: #333;
    text-align: center
}
.index-set3-cont li{
    width: calc(100% / 6);
   
    float: left;
}
.index-set3-cont li .text{
    width: 47%;
    height: 834px;
    position: relative;
    margin: 0 auto;
    z-index: 1;
    perspective: 500px;
    overflow: hidden;
}
.index-set3-cont li .text::before{
    width: 100%;
    height: 100%;
    content: '';
    background: url('../images/index-set3-li.jpg') no-repeat center;
    position: absolute;
    left: 0;
    top: 0;
    transition: all 0.5s;
    transform: translateX(-100%);
    /* transform: rotateY(90deg); */
    opacity: 0;
}
.index-set3-cont li:hover .text::before{
    transform: translateX(0%);
    opacity: 1;
}
.index-set3-cont li .tex{
    position: absolute;
    left: 50%;
    top: 52%;
    transform: translate(-50%,-50%);
    text-align: center;
    width: 100%;
   
}
.index-set3-cont li .tex span{
    width: 34px;
    height: 34px;
    border-radius: 50%;
    background: #626262;
    color: #fff;
    display: block;
    margin: 0 auto 35px;
    line-height: 34px;
}
.index-set3-cont li .tex .desc{
    writing-mode:vertical-rl;
    line-height: 1.5;
    margin: 0 auto;
    text-align: left;
    font-size: 18px;
    color: #333333
}
.index-set4{
    width: 100%;
    padding: 110px 0;
}
.index-set4 .left{
    width: 35%;
    padding: 100px 44px 0 70px;
}
.index-set4 .left h6{
    width: 85%;
    font-size: 48px;
    color: #333333;
    padding-bottom: 30px;
    margin-bottom: 30px;
    border-bottom: 1px solid #b5b5b5
}
.index-set4 .left .cont{
    font-size: 18px;
}
.index-set4 .rigth{
    width: 65%;
}
.index-set4 .left .btn{
    width: 100%;
    margin-top: 66px;
}
.index-set4 .left .btn a{
    width: 150px;
    line-height: 40px;
    text-align: center;
    display: inline-block;
    border-radius: 6px;
    background: var(--action);
    color: #333
}
.index-set4 .left .btn .cond{
    display: inline-block;
    vertical-align: middle;
    margin-left: 10px;
}
.index-set4 .left .btn .cond span{
    font-size: 24px;
    color: #333;
    display: inline-block;
    vertical-align: middle
}
.index-set4 .rigth img{
    width: 100%;
    height: auto;
}
.index-set4-r{
    padding-bottom: 50px;
}
.swiper-pagination-bullet-active{
    background: var(--action) !important
}
.index-set5{
    width: 100%;
    height: 930px;
    position: relative;
}
.index-set5 .main{
    width: 100%;
    height: 920px;
    background: no-repeat 50% -0px fixed;
    position: absolute;
    top: 0;
    left: 0;
    z-index: -1;
    background-image: url('../images/index-set5.jpg');
}
.index-set6{
    width: 100%;
    padding: 88px 0 40px;
    background: #f7f7f7
}
.index-set6 .left{
    width: 30%;
    padding-top: 32px;
}
.index-set6 .rigth{
    width: 70%;
}
.index-set6-uld{
    width: 100%;
    position: relative;
}
.index-set6-uld li{
    width: 203px;
    float: left;
    text-align: center;
    margin-right: 10px;
}
.index-set6-uld li .imgdt{
    height: 257px;
    position: relative;
    
}
.index-set6-uld li .imgdt img{
    position: absolute;
    left: 0;
    width: 100%;
    height: auto;
    top: 0;
    z-index: 1;
}
.index-set6-uld li .imgdt .td{
    z-index: 2;
    transition: all 1s
}
.index-set6-uld li:hover .imgdt .td{
    opacity: 0;
}
.index-set6-uld li p{
    font-size: 16px;
    padding-top: 10px;
}
.index-set6-uld .bd{
    width: 1050px;
    margin: 0 auto;
}
.index-set6-uld .btn{
    position: absolute;
    background-image: url('../images/index-set5-ico.png');
    background-repeat: no-repeat;
    background-position: center;
    top: 50%;
    height: 50px;
    width: 50px;
    border-radius: 50%;
    background-color: #dddddd;
    cursor: pointer;
    transform: translateY(-50%)
}
.index-set6-uld .prev{
    left: 0;
}
.index-set6-uld .next{
    right: 0;
    transform: rotate(180deg)
}
.index-set6-uld .btn:hover{
    background-color: var(--action)
}
.index-set6 .left h6{
    font-size: 36px;
    color: #333;
}
.index-set6 .left p{
    color: #666;
    font-size: 20px;
    padding: 12px 0;
}
.index-set6 .left a{
    display: inline-block;
    line-height: 42px;
    width: 150px;
    border-radius: 6px;
    background: var(--action);
    text-align: center;
    font-size: 16px;
    margin-top: 50px;
    color: #333
}
.index-set6 .left a:hover{
    color: #fff
}
.index-set7 .left{
    width: 68%;
    padding-top: 97px;
}
.index-set7-cont li{
    width: 32%;
    margin-right: 2%;
    float: left;
}
.index-set7-cont li .flash img{
    height: 254px ;
}
.index-set7-cont li:nth-of-type(3n){
    margin-right: 0;
}
.index-set7 .left .title{
    border-bottom: 5px solid #d4d4d4;
    margin-bottom: 46px;
    padding-bottom: 20px;
}
.index-set7 .left .title h6{
    font-size: 18px;
}
.index-set7 .left .title span{
    font-size: 36px;
    margin-right: 15px;
}
.index-set7-cont li h6{
    font-size: 22px;
    color: #333;
    margin-bottom: 20px;
}
.index-set7-cont li a p{
    font-size: 16px;
    color: #666;
    margin-top: 20px;
}
.index-set7-cont li a p b:hover{
    color: var(--action)
}
.index-set7 .right{
    width: 28%;
    padding-left: 5%;
    border-left: 1px solid #e5e5e5;
    padding-top: 101px;
    padding-bottom: 80px;
}
.index-set7 .right h6{
    font-size: 36px;
    margin-bottom: 20px;
} 
.index-set7 .right h6 a{
    font-size: 16px;
    margin-top: 18px;
}
.index-set7-ves{
    position: relative;
}
.index-set7-ves .bd li{
    border-radius: 6px;
    overflow: hidden;
    position: relative;
}
.index-set7-ves .bd li .dt{
    position: absolute;
    width: 100%;
    bottom: 12px;
    left: 0;
    padding: 0 26px;
}
.index-set7-ves .bd li .dt p{
    font-size: 18px;
    color: #fff
}
.index-set7-ves .bd li .dt h6{
    font-size: 19px;
    color: #fff
}
.index-set7-ves .bd li img{
    width: 100%;
    height: auto;
}
.index-set7-ves .hd{
    /* width: 100%;
    text-align: center;
    position: absolute;
    bottom: 6%;
    left: 0; */
    text-align: center;
    margin-top: 0px;
}
.index-set7-ves .hd li{
    width: 10px;
    height: 10px;
    display: inline-block;
    border-radius: 50%;
    background: #dcdcdc;
    font-size: 0;
    margin: 0 5px;
    cursor: pointer;

}
.index-set7-ves .hd li.on{
    background: var(--action)
}
footer{
    background: #f5f5f5;
    padding: 52px 0 20px; 
}
footer .left .fot a{
     color: #333333;
     display: inline-block;
     margin-right: 40px;
}
footer .left .btd{
    padding: 30px 0;
}
footer .left .btd span{
    color: #666
}
footer .left .btd h6{
    font-size: 20px;
    color: var(--action);
    font-weight: bold;
}
footer .left .fot{
    font-size: 16px;
    color: #333
}
footer .left .fot a:hover{
    color: var(--action)
}
footer .left .fotd{
    font-size: 14px;
    color: #666
}
footer .left .fotd > a{
    font-size: 14px;
    color: #666;
    display: inline-block;
    vertical-align: middle;
    border-right: 1px solid #a7a7a7;
    line-height: 14px;
    padding-right: 10px;
    margin-right: 10px;
}
footer .left .fotd > a:last-of-type{
    border-right: none
}
footer .left .fotd > a:hover{
    color: var(--action)
}
footer .left .fotd p{
    margin-top: 5px;
    font-size: 14px;
}
footer .left .fotd p a{
    color: #666
}
footer .left .fotd p a:hover{
    color: var(--action)
}
footer .rigth .bdt{
    display: inline-block;
    vertical-align: text-top
    /* margin-bottom: 20px; */
}
footer .rigth .bdt ul{
   padding-top: 100px;
}
footer .rigth .bdt li{
    display: inline-block;
    width: 34px;
    height: 34px;
    text-align: center;
    background: #868686;
    border-radius: 50%;
    padding-top: 3px;
    cursor: pointer;
}
footer .rigth .bdt li:hover{
    background: var(--action)
}
footer .rigth .bdt li img{
  
    width: 70%;
    height: auto;
}
footer .rigth .wx{
    display: inline-block;
    margin-left: 50px;
    text-align: center;
    vertical-align: text-top
}
footer .rigth .wx img{
    display:block;
    margin-bottom: 13px;
}
footer .rigth .wx h5 a{
   display: inline-block;
   margin: 0 6px;
   color: #666;
   font-size: 16px;
   margin-top: 10px;
}
.case-ves .index-set2-nav{
    padding-top: 30px;
}
.index-set2-page li .img{
    border-radius: 5px
}
.casedef-nav {
    padding: 92px 0 43px;
}
.casedef-nav h3{
    font-size: 30px;
    color: #333
}
.casedef-nav .navd p{
    display: inline-block;
    vertical-align: middle;
    font-size: 16px;
    color: #999999
}
.casedef-nav .navd p a{
    color: #999999;
}
.casedef-nav .navd p a:hover{
    color: var(--action)
}
.casedef-nav .navd p a:last-of-type{
    color: #333
}
.casedef-nav .navd > a{
    display: inline-block;
    vertical-align: middle;
    padding: 6px 22px;
    background: var(--action);
    font-size: 16px;
    color: #333;
    border-radius: 6px;
    margin-left: 20px;
}
.casedef-cont{
    background: #c7c7c7;
}
.swiper-slide img{
    max-width: 100%;
  
}
.casedef-d{
    width: 100%;
    position: relative;
}
.casedef-d i{
    width: 51px;
    height: 50px;
    display: block;
    position: absolute;
    cursor: pointer;
    top: 50%;
    background-image: url('../images/pro_le.png?v=111');
    background-repeat: no-repeat;
    background-position: center;
    background-size: 100% 100%;
}
.casedef-d  .next{
    left: 0;
    transform: rotate(180deg)
}
.casedef-d .prev{
    right: 0;
}
.casedef-d .btn{
    position: absolute;
    right: 80px;
    top: 100px;
    height: 55px;
    width: 55px;
    border-radius: 50%;
    background-color: #fff;
    cursor: pointer;
    background-image: url('../images/ico-case.png');
    background-repeat: no-repeat;
    background-position: center;
}
.casedef-d .xx{
    position: absolute;
    right: -20px;
    top: 50%;
    height: 55px;
    width: 55px;
    border-radius: 50%;
    background-color: #fff;
    cursor: pointer;
    background-image: url('../images/ico-x.png');
    background-repeat: no-repeat;
    background-position: center;
    z-index: 2;
    margin-top: -25px;
    display: none
}
.casedef-d .show{
    transform:translateX(0);
    opacity: 1;
}
.casedef-text{
    position: absolute;
    width: 405px;
    height: 100%;
    right: 60px;
    top: 0;
    background: #fff;
    z-index: 3;
    
    /* border-right: 8px solid #f7f7f7; */
    border-bottom: 1px solid #eeeeee;
    border-top: 1px solid #eeeeee;
    transform: translateX(500px);
    opacity: 0;
    transform-origin: 100% 0;
    transition: all 0.6s;
    overflow-y: auto;
 }

 .casedef-text::-webkit-scrollbar 

{  
    width: 6px;  
    height:10px;     

   background-color:var(--action);

}  
.casedef-text::-webkit-scrollbar-track     
{  
    -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3);  
    border-radius: 10px; 
      background-color:#f7f7f7;    

}




.casedef-text::-webkit-scrollbar-thumb  
{  
    border-radius: 10px;  
    -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,.3);  
   background-color:var(--action);
} 


 .casedef-text .dts{
    padding: 69px 68px;
 }
 .casedef-text h3{
     font-size: 24px;
     color: #333;
   
 }
 .casedef-text > .i{
     height: 30px;
     width: 100%;
     display: block;
     /* border-right: 8px solid var(--action); */
     transform: translateX(58px);
 }
 .casedef-text h6{
     color: #666;
     margin-bottom: 35px;
 }
 .casedef-text .cont{
     color: #333;
     line-height: 2;
     padding-bottom: 30px;
     border-bottom: 5px solid #dcdcdc;
     margin-bottom: 30px;
 }
 .casedef-text .tex{
     color: #666;
     line-height: 2;
     text-align: justify;
 }
 .casedef-text .tex img{
     max-width: 100%;
     height: auto !important;
 }
 .casedef-set{
     width: 100%;
     padding-bottom: 60px;
 }
 .casedef-set h3{
     text-align: center;
     font-size: 30px;
     color: #333;
     padding: 50px 0 42px;
 }
 .casedef-d .xx:hover{
     background-color: var(--action)
 }
 .casedef-d .btn:hover{
    background-color: var(--action)
 }
 .xc-tit{
     font-size:16px;
     color: #666;
     padding: 36px 0;
     border-bottom: 1px solid #d4d4d4;
     margin-bottom: 45px;
 }
 .xc-set2{
     padding-bottom: 80px;
 }
 .xc-set2-cont{
     width: 100%;
     position: relative;
 }
 .xc-set2-cont li{
     background: #fff
 }
 .xc-set2 .left{
     width: 39.2%;
 }
 .xc-set2 .rigth{
     width: 57%;
 }
 .xc-set2 .rigth img{
     width: 100%;
     height: auto;
 }
 .xc-set2 .left h3{
     font-size: 24px;
     color: #333;
     margin-bottom: 60px;
 }
 .xc-set2 .left .cont{
     font-size: 16px;
     color: #787878;
     line-height: 2;
    
 }
 .xc-set2 .left a{
     line-height: 42px;
     border-radius: 6px;
     color: #333;
     background-color: var(--action);
     display: block;
     text-align: center;
     width: 180px;
     margin-top: 60px;
 }
 .xc-set2-ves{
    width: 39.2%;
    bottom: 0;
    left: 0;
    position: absolute;
    text-align: right;
    padding-top: 20px;
    border-top: 1px solid #dcdcdc;
    z-index: 2;
 }
 .xc-set2-ves .swiper-paginationd{
   display: inline-block;
   width: 54px;
   text-align: center
 }
 .xc-set2-ves span{
     cursor: pointer;
 }
 .xc-set3{
     background: #f0f0f0;
     padding: 16px 25px;
     margin-bottom: 62px;
 }
 .xc-set3 .fl{
     font-size: 16px;
 }
 .xc-set3 .fl span{
     display: inline-block;
     vertical-align: middle;
     margin-right: 26px;
 }
 .xc-set3 .fl b{
     font-size: 18px;
     display: inline-block;
     vertical-align: middle;
     margin-right: 6px;
 }
 .xc-set3 .fr{
     margin-top: 10px;
 }
 .xc-set3 .fr a{
     display: inline-block;
     width: 46px;
     width: 160px;
     text-align: center;
     border-radius: 6px;
     background: var(--action);
     font-size: 16px;
     color: #333;
     line-height: 42px;
     margin-right: 20px;
     border-color: var(--action)
 }
 .xc-set3 .fr span{
     font-size: 28px;
     color: #333;
     display: inline-block;
     vertical-align: middle
 }
 .xc-set4{
     padding-bottom: 80px;
 }
 .xc-set4 .title{
     margin-bottom: 40px;
     padding: 10px 0;
 }
 .xc-set4 .title h3{
     font-size: 28px;
 }
 .xc-set4-ce{
     position: relative;
 }
 .xc-set4-ce i{
     width: 50px;
     height: 50px;
     background-color: #dddddd;
     border-radius: 50%;
     position: absolute;
     background-image: url('../images/xc-set4-d.png');
     background-repeat: no-repeat;
     background-position: center;
     top: 50%;
     z-index: 2;
     margin-top: -25px;
     cursor: pointer;
     
 }
 .xc-set4-ce .next{
    left: -80px;
    
 }
 .xc-set4-ce .prev{
     right: -80px;
     transform:rotate(180deg)
 }
 .xc-set4-ce i:hover{
     background-color: var(--action)
 }



.flash{overflow:hidden;width:100%;position:relative;border-radius: 6px}
.flash img{
     width: 100%;
     height: auto;
     transition: all 0.8s
}
/* .flash em{ cursor: pointer;height: 100%;width: 100%; left: -100%;position: absolute;top: 0;transform: skewX(-25deg);transition: all 0s; width: 380px;
     background-image:-moz-linear-gradient(0deg, rgba(255, 255, 255, 0), rgba(255, 255, 255, 0.7), rgba(255, 255, 255, 0));
     background-image:-webkit-linear-gradient(0deg, rgba(255, 255, 255, 0), rgba(255, 255, 255, 0.7), rgba(255, 255, 255, 0));
     background-image:-o-linear-gradient(0deg, rgba(255, 255, 255, 0), rgba(255, 255, 255, 0.7), rgba(255, 255, 255, 0));
     background-image:-ms-linear-gradient(0deg, rgba(255, 255, 255, 0), rgba(255, 255, 255, 0.7), rgba(255, 255, 255, 0));
     z-index: 2;
} */
/* .flash:hover em{left:380px;transition: all 0.7s;} */
.flash:hover img{
    transform: scale(1.1)
}
.flash em{
    display: none
}
 .xc-set4-cont .flash{
    /* height: 300px; */
 }
 .fz-nav{
     font-size: 16px;
     padding: 35px 0;
     color: #999999
 }
 .fw-set1{
     width: 100%;
     padding: 68px 0 24px;
 }
 .fw-set1 h3{
     text-align: center;
     font-size: 42px;
     color: #333;
     margin-bottom: 72px;
 }
 .fw-set1-cont{
     width: 100%;
     text-align: center;
     border-bottom: 8px solid #d9d9d9;
     padding-bottom: 48px;
 }
 .fw-set1-cont li{
     display: inline-block;
     margin-right: 158px;
 }
 .fw-set1-cont li:nth-of-type(3n){
     margin-right: 0;
 }
 .fw-set1-cont .mp{
     width: 115px;
     height: 115px;
     border-radius: 50%;
     background-color: #fec500;
     text-align: center;
     padding-top: 22px;
     display: inline-block;
     vertical-align: middle;
     margin-right: 15px;
     border: 8px solid #ffedb2
 }
 .fw-set1-cont h6{
     font-size: 22px;
     display: inline-block;
     vertical-align: middle
 }
 .fw-set2{
     width: 100%;
     padding-bottom: 35px;
 }
 .fw-set2 h3{
    text-align: center;
    font-size: 42px;
    color: #333;
    padding: 84px 0 78px;
 }
 .sf-cont{
     padding-bottom: 93px;
 }
 .fw-set2-cont li{
     width: 24%;
     float: left;
     margin-right: 1.333%;
     margin-bottom: 42px;
 }
 .fw-set2-cont li:nth-of-type(4n){
     margin-right: 0;
 }
 .fw-set2-cont li .flash{
     height: 150px;
 }
 .fw-set2-cont li .text{
     height: 60px;
 }
 .fw-set2-cont li h6{
     font-size: 20px;
     color: #333;
     margin-top: 35px;
     margin-bottom: 10px;
 }
 .fw-set2-cont li .text{
     font-size: 15px;
     color: #999
 }
 .sf-title{
     text-align: center;
     font-size: 38px;
     color: #333;
     padding: 52px 0 22px;
 }
 .sf-cont li{
     padding: 48px 0;
     border-bottom: 1px dashed #dcdcdc;
 }
 .sf-cont li h3{
     font-size: 18px;
     color: #333;
     font-weight: bold;
     margin-bottom: 20px;
 }
 .sf-cont li h3 em{
     display: inline-block;
     width: 50px;
     height: 50px;
     vertical-align: middle;
     text-align: center;
     line-height: 50px;
     background: var(--action);
     border-radius: 50%;
     margin-right: 10px;
 }
 .sf-cont li .cont{
     font-size: 14px;
     color: #787878;
     padding-left: 30px;
 }
 .sf-cont li .text{
    font-size: 14px;
    color: #787878;
    margin-top: 30px;
 }
 .sf-des{
     margin-top: 40px;
 }
 .sf-des h3{
     font-size: 18px;
     color: #333333;
     font-weight: bold;
     margin-bottom: 20px;
 }
 .sf-des .cont{
    color: #787878;
 }
 .new-bananr{
     width: 100%;
     padding-top: 210px;
     background: url('../images/new-bj.png') no-repeat center bottom;
     padding-bottom: 80px;
 }
 .new-bant{
     text-align: center;
     margin-bottom: 68px;
 }
 .new-bant a{
     display: inline-block;
     vertical-align: middle;
     font-size: 16px;
     color: #333;
     line-height: 42px;
     width: 160px;
     border-radius: 6px;
     perspective: 500px;
     margin: 0 15px;
     position: relative;
     z-index: 1;
     overflow: hidden;
 }
 .new-bant a::before{
     width: 100%;
     height: 100%;
     border-radius: 6px;
     background:var(--action);
     position: absolute;
     left: 0;
     top: 0;
     z-index: -1;
     content: '';
     transform: translateY(-100%);
     /* transform: rotateX(90deg); */
     opacity: 0;
     transition: all 0.5s
 }
 .new-bant a:hover::before{
    transform: translateY(0%);
    /* transform: rotateX(360deg); */
    opacity: 1;
 }
 .new-bant a.on::before{
    transform: rotateX(360deg);
    opacity: 1;
 }
 .new-contd {
     background: #fff;
     border-radius: 6px;
   
 }
 .new-contd .flash{
     width: 517px;
     height: 355px;
     border-radius: 6px
 }

 .new-contd .text{
    padding: 56px 75px;
     width: 809px;
   
 }
 .new-contd .text h3{
     font-size: 22px;
     color: #333;
     
 }
 .new-contd .text h6{
     font-size: 14px;
     padding: 25px 0;
     color: #666
 } 
 .new-contd .text p{
     font-size: 16px;
     height: 110px;
 }
 .new-mb{
     padding: 44px 0 20px;
 }
 .new-cont{
     padding-bottom: 60px;
 }
 .new-page{
     width: 100%;
     padding: 36px 0;
     border-bottom: 1px solid #e5e5e5;
     position: relative;
 }
 .new-page::before{
     width: 0;
     content: '';
     height: 1px;
     background: var(--action);
     position: absolute;
     left: 0;
     bottom: -1px;
     opacity: 0;
     transition: all 0.5s
 }
 .new-page:hover::before{
     width: 100%;
     opacity: 1;
 }
 .new-page:hover h5{
     color: var(--action)
 }
 .new-page .flash{
     width: 370px;
     height: 240px;
 }
 .new-page:hover .text{
   transform: translate(-10px,-0px)
 }
 .new-page .text{
     width: 960px;
     transition: all 0.5s
 }
 .new-page h5{
     font-size: 22px;
     color: #333;
     margin-top: 15px;
 }
 .new-page h6{
     color: #666;
     padding: 10px 0 30px;
 }
 .new-page p{
     color: #666;
     height: 100px;
 }
 .new-page span{
     color: #666
 }
 .new-page span:hover{
     color: var(--action)
 }
 .zl-tit{
     font-size: 16px;
     color: #666;
     padding: 48px 0 42px;
 }
 .zl-tit a{
     color: #666
 }
 .zl-tit a:last-child{
     color: #333
 }
 .zl-tit a:hover{
     color: var(--action)
 }
 .zl-set1{
     background: #f9f7f6
 }
 .zl-set1-cont{
     width: 100%;
     background: url('../images/zl-set1-bj.jpg') no-repeat center bottom;
     padding: 48px 0 33px;
 }
 .zl-set1-cont .rigth{
     width: 457px;
 }
 .zl-set1-cont .left h3{
     font-size: 48px;
     position: relative;
     z-index: 1;
 }
 .zl-set1-cont .left h3::before{
     width: 62px;
     height: 62px;
     border-radius: 50%;
     content: '';
     position: absolute;
     background: var(--action);
     left: 40px;
     top: 50%;
     transform: translateY(-50%);
     z-index: -1;
 }
 .zl-set1-cont .left h6{
     width: 50px;
     font-size: 27px;
     color: #333333;
     line-height: 1.1;
     padding: 40px 0 192px;
 }
 .zl-set1-cont .left .cont{
     font-size: 14px;
     color: #666;
     margin-bottom: 77px;
 }
 .zl-set1-cont .left h5{
     font-size: 28px;
     color: #333;
     margin-bottom: 20px;
 }
 .zl-set1-cont .left .text{
     color: #333
 }
 .zl-set1-cont .rigth h6{
     font-size: 28px;
     margin-bottom: 20px;
 }
 .zl-set1-cont .rigth .text{
     color: #666
 }
 .zl-set2{
     width: 100%;
     background: #f9f9f9;
     padding-bottom: 77px;
 }
 .zl-set2 h3{
     font-size: 36px;
     text-align: center;
     padding: 71px 0 30px;
 }
 .zl-set2 .tit{
     text-align: center;
     color: #666;
     padding-bottom: 67px;
 }
 .zl-set3{
     width: 100%;
 }
 .zl-set3 h3{
     text-align: center;
     font-size: 28px;
     padding: 67px 0 50px;
 }
 .zl-set3 ul{
     padding-bottom: 50px;
 }
 .zl-set3 li{
     width: 48%;
     float: left;
     margin-right: 4%;
     font-size: 16px;
     padding: 15px 0;
     border-bottom: 1px dashed #aaaaaa
 }
 .zl-set3 li:hover h6{
     transform: translateX(10px);
     color: var(--action)
 }
 .zl-set3 li:nth-of-type(2),
 .zl-set3 li:first-of-type{
    border-top: 1px dashed #aaaaaa
 }
 .zl-set3 li:nth-of-type(2n){
     margin-right: 0;
 }
 .zl-set3 li h6{
     color: #333333;
     transition: all 0.5s
 }
 .zl-set3 li span{
     color: #333
 }
 .zl-set3 li h6::before{
     width: 6px;
     height: 6px;
     border-radius: 50%;
     display: inline-block;
     vertical-align: middle;
     background: #d2d2d2;
     content: '';
     margin-right: 8px;
 }
 .ab-tit{
     color: #666;
     font-size: 16px;
     padding: 20px 0;
 }
 .ab-tit .fl a{
    color: #666;
 }
 .ab-tit .fl a:last-of-type{
     color: #333
 }
 .ab-tit .fl a:hover{
     color: var(--action)
 }
 .ab-tit .fr a{
     line-height: 3.5;
     display: inline-block;
     margin-left: 50px;
     position: relative;
 }
 .ab-tit .fr a::before{
     width: 0;
     height: 4px;
     content: '';
     background: var(--action);
     position: absolute;
     left: 0;
     bottom: 0;
     opacity: 0;
     transition: all 0.5s;
 }
 .ab-tit .fr a.on::before{
     width: 100%;
     opacity: 1;
 }
 .ab-tit .fl{
     padding-top: 24px;
 }
 .ab-set-ves{
     width: 903px;
     margin: 0 auto;
     /* box-shadow: 0 0 5px rgba(0,0,0,.3); */
     /* margin-left: auto; */
     padding-top: 88px;
 }
 .ab-set-cont{
     font-size: 14px;
     color: #666666;
     margin-bottom: 36px;
 }
 .ab-set-ves h6{
     font-size: 18px;
     color: #333333;
     font-weight: bold;
     margin-bottom: 28px;
 }
 .ab-set1{
     padding-bottom: 20px;
     border-bottom: 7px solid #dcdcdc;
 }
 .ab-set2{
     width: 100%;
     padding-top: 42px;
 }
 .ab-set2 h3{
     font-size: 28px;
     font-weight: bold;
     color: #333;
     margin-bottom: 32px;
 }
 .ab-set2 .imgd{
     margin-bottom: 50px;
 }
 .ab-set-text{
    font-size: 14px;
    color: #999999;
    margin-bottom: 36px;
 }
 .ab-setd{
     width: 100%;
     position: relative;
 }
 .ab-ses{
     width: 100%;
     position: absolute;
     left: 0;
     top: 90px;
 }
 .ab-ses h2{
     font-size: 48px;
     color: #000;
     position: relative;
     z-index: 1;
 }
 .ab-ses h2::before{
     width: 67px;
     height: 67px;
     background: var(--action);
     border-radius: 50%;
     content: '';
     position: absolute;
     left: 38px;
     top: 50%;
     transform: translateY(-50%);
     z-index: -1;
 }
 .wm-title{
     width: 100%;
     margin-bottom: 40px;
     padding-top: 40px;
 }
 .wm-title h6{
     font-size: 36px;
     font-weight: bold;
     color: #333
 }
 .wm-title p{
     font-size: 20px;
 }
 .wm-cont{
     width: 100%;
     padding-bottom: 50px;
 }
 .wm-cont li{
     width: 23%;
     margin-right: 2.3333%;
     float: left;
     margin-bottom: 30px;
 }
 .wm-cont li .imgdt{
     position: relative;
     width: 100%;
     height: auto;
     border-radius: 4px;
     overflow: hidden;
     height: 408px;
 }
 .wm-cont li .imgdt .td{
     width: 100%;
     height: auto;
     position: absolute;
     left: 0;
     top: 0;
     transition: all 1s;
     border-radius: 4px;
     overflow: hidden;
 }
 .wm-cont li:hover .imgdt .td{
     opacity: 0;
 }
 .wm-cont li:nth-of-type(4n){
     margin-right: 0;
 }
 .wm-cont li .flash{
     height: 408px;
     border-radius: 6px
 }
 .wm-cont li .text{
   font-size: 18px;
   padding: 15px 0;
   border-bottom: 1px solid #444654;
   background: url('../images/wm-ico.jpg') no-repeat right center;
   position: relative;
 }
 .wm-cont li .text::before{
     content: '';
     width: 0;
     height: 1px;
     position: absolute;
     left: 0;
     bottom: -1px;
     background: var(--action);
     opacity: 0;
     transition: all 0.5s
 }
 .wm-cont li:hover .text::before{
     width: 100%;
     opacity: 1;
 }
 .wm-cont li:hover .text h6{
     color: var(--action)
 }
 .wmd-nav{
     width: 100%;
     padding: 40px 0 20px;
 }
 .wmd-nav .mb{
     font-size: 16px;
     color: #999999;
     margin-top: 20px;
 }
 .wmd-nav .mb a{
    color: #999999 
 }
 .wmd-nav .mb a:last-of-type{
     color: #333
 }
 .wmd-nav .mb a:hover{
     color: var(--action)
 }
 .wmd-nav .fr a{
     display: block;
     width: 140px;
     line-height: 42px;
     border-radius: 6px;
     background: var(--action);
     text-align: center;
     color: #333;
     margin-top: 18px;
 }
 .wmd-td .flash{
     width: 503px;
     height: 638px;
 }
 .wmd-td .text{
     width: 792px;
 }
 .wmd-td .text h3{
     font-size: 36px;
     color: #333;
     padding: 30px 0 50px;
 }
 .wmd-td .cont{
     padding-bottom: 20px;
     border-bottom: 1px dashed #22297a;
     margin-bottom: 20px;
 }
 .wmd-td .cont li{
     width: 35%;
     float: left;
     margin-right: 5%;
     font-size: 16px;
     color: #999;
     line-height: 2;
 }
 .wmd-td .cont li em{
     color: #333
 }
 .wmd-td .desc{
     color: #666666
 }
 .wdbt{
     width: 100%;
     margin-top: 70px;
 }
 .wdbt >a{
     display: inline-block;
     vertical-align: middle;
     width: 150px;
     text-align: center;
     border-radius: 6px;
     background: var(--action);
     color: #333;
     line-height: 42px;
     font-size: 16px;
 }
 .wdbt .pd{
     display: inline-block;
     vertical-align: middle;
     margin-left: 35px;
 }
 .wdbt .pd .dttt{
     display: inline-block;
     vertical-align: middle;
     position: relative;
     margin-right: 10px;
 }
 .wmd-set1{
     width: 100%;
     padding-bottom: 80px;
 }
 .wmd-set1 h3{
     font-size: 36px;
     color: #333;
     padding: 72px 0 32px;
     border-bottom: 5px solid #eeeeee;
     margin-bottom: 40px;
 }
 .wmd-set1 h6{
     text-align: center;
     font-size: 16px;
     color: #333;
     padding: 10px 0;
 }
 .wmd-set1 .xc-set4-cont .flash{
     /* height: 226px; */
 }
 .wmd-set2 {
     padding-bottom: 80px;
 }
 .wmd-set2 h3{
     font-size: 16px;
     color: #666;
     padding: 48px 0 32px;
     border-bottom: 5px solid #eeeeee;
     margin-bottom: 40px;
 }
 .wmd-set2 h3 span{
    font-size: 36px;
    color: #333;
    display: inline-block;
    margin-right: 20px;
 }
 .wmd-set2 .xc-set4-cont .flash{
     height: 420px;
 }
 .cont-set1{
     width: 100%;
     text-align: center;
     padding: 100px 0;
 }
 .cont-set1 li{
     display: inline-block;
     text-align: left;
     vertical-align: middle;
     margin-right: 150px;
 }
 .cont-set1 li:last-of-type{
     margin-right: 0;
 }
 .cont-set1 li p{
     display: inline-block;
     vertical-align: middle;
     color: #666
 }
 .cont-set1 li h6{
     font-size: 22px;
     color: #333
 }
 .cont-set1 li i{
     width: 43px;
     height: 43px;
     border-radius: 50%;
     border: 1px solid #666;
     display: inline-block;
     vertical-align: middle;
     margin-right: 10px;
 }
 .cont-set1 li .dh{
     background-image: url('../images/cont-phone.png');
     background-position: center;
     background-repeat: no-repeat
 }
 .cont-set1 li .yx{
    background-image: url('../images/cont-yx.png');
    background-position: center;
    background-repeat: no-repeat
 }
.cont-set2{
    width: 100%;
    padding: 70px 0;
    background: url('../images/co-set2-bj.jpg') no-repeat center;
}
.cont-set2 .wx{
    text-align: center;
    margin-bottom: 45px;
}
.cont-set2 .wx li{
    display: inline-block;
    vertical-align: middle;
    margin: 0 20px;
}
.cont-set2 .wx li p{
    font-size: 18px;
    color: #333;
    margin-top: 6px;
}
.cont-set2 h3{
    font-size: 20px;
    color: #333;
    text-align: center;
    margin-bottom: 10px;
}
.cont-set2 > p{
    text-align: center;
    color: #666;
}
.cont-set3{
    width: 100%;
    padding: 100px 0 40px; 
}
.cont-set3 li{
    width: 48%;
    margin-right: 4%;
    float: left;
}
.cont-set3 li:nth-of-type(2n){
  margin-right: 0;
}
.cont-set3 li h6{
    font-size: 24px;
    color: #333;
    margin-bottom: 10px;
}
.cont-set3 li > p{
    width: 60%;
    color: #666;
    margin-bottom: 50px;
}
.cont-set3 li .to{
    font-size: 18px;
    color: #333;
    width: 160px;
    line-height: 42px;
    border-radius: 3px;
    background: var(--action);
    display: block;
    text-align: center;
    margin: 50px 0 40px;
}
.cont-set4{
    width: 100%;
    background: url('../images/cont-set4-bj.png') no-repeat center;
    padding: 65px 0 42px;
}
.cont-set4 h3{
    text-align: center;
    font-size: 36px;
    color: #333;
    margin-bottom: 32px;
}
.cont-set4 .form .text{
    float: left;
    display: block;
    width: 49%;
    float: left;
    background: #fff;
    margin-right: 2%;
    font-size: 16px;
    padding: 15px 20px;
    border-radius: 6px;
    border: 1px solid #dfdfdf
}
.cont-set4 .form .text:nth-of-type(2n){
    margin-right: 0;
}
.cont-set4 textarea{
    display:block;
    width: 100%;
    border: 1px solid #dfdfdf;
    background: #fff;
    padding: 20px;
    margin-top: 20px;
    border-radius: 6px;
}
.cont-set4 .submit{
    width: 160px;
    text-align: center;
    display: block;
    border-radius: 6px;
    background: var(--action);
    line-height: 42px;
    margin: 40px auto 0;
    font-size: 16px;
}
.tnavbox{
    position: absolute;
    width: 160px;
    left: 50%;
    margin-left: -80px;
    top: 85%;
    height: 0;
    padding-top: 15px;
    /* display: none; */
    text-align: center;
    z-index: 99999999;
}
.tnav{
    background: #fff;
    box-shadow: 0 0 16px -4px rgba(0,0,0,.3);
    padding: 20px 0 18px;
    transform: translateY(20px);
    -webkit-transform: translateY(20px);
    opacity: 0;
    visibility: hidden;
    transition: .5s;
    -webkit-transition: .5s;
}
.tnavbox i{
    position: absolute;
    width: 20px;
    height: 4px;
    background-color: #000;
    left: 50%;
    top: 0;
    margin-left: -10px;
}
.header .nav li:hover .tnavbox{
    height: 100px;
}
.header .nav li:hover .tnavbox .tnav {
    transform: translate(0);
    -webkit-transform: translate(0);
    opacity: 1;
    visibility: visible;
}
.tnav a{
    display: block;
    color: #666;
    line-height: 35px;
    border-bottom: 1px solid transparent;
    -webkit-transition: .3s;
    -o-transition: .3s;
    transition: .3s;
    font-size: 14px;
}
.tnav a:hover{
    background: #000;
    color: #fff
}
.bananr h6{
    font-size: 48px;
    line-height: 1.2;
    color: #000000
  }
  .bananr .fl a{
    width: 319px;
    height: 50px;
    display: block;
    background: url('../images/b-to.jpg') no-repeat center;
    background-size: 100% 100%;
    margin-top: 60px;
    /* background: #000; */
  }
  .vp-d{
    width: 1092px;
    height: 870px;
    position: relative;
  }
  /* .vp-d::before{
      width: 100%;
      height: 100%;
      position: absolute;
      left: 0;
      top: 0;
      background: url('../images/fangz.png') no-repeat;
      background-size: 100% 100%;
      content: '';
      z-index: 3;
  } */
  .bananr .fl{
    padding-top: 291px;
    padding-left: 25px;
  }
  .bananr .swiper-wrapper{
      z-index: 3;
  }
  .bananr .swiper-container{
    z-index: 3;
  }
  .bananr .swiper-container::before{
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;
    background: url('../images/fangz.png') no-repeat;
    background-size: 100% 100%;
    content: '';
    z-index: 4;
  }
  /* .bananr .swiper-wrapper::before{
   
  } */
  .bananr .swiper-pagination{
    bottom: 57px !important;
  }
  .bananr .vpdd{
      position: absolute;
      width: 81px;
      height: 81px;
      left: 50%;
      top: 50%;
      transform: translate(-50%,-50%);
      background: url('../images/dt.png') no-repeat center;
      z-index: 5;
      cursor: pointer;
  }
  .index-f{
    width: 100%;
    position: fixed;
    background: rgba(0, 0, 0, 0.8);
    height: 100%;
    z-index: 20;
    left: 0;
    top: 0;
    transform: scale(0);
    transform-origin: 100% 0;
    transition: all 0.3s ease-in;
    opacity: 0;
    border-bottom-left-radius: 200%;
}
.index-off{
  transform: scale(1) !important;
  opacity: 1 !important;
  border-bottom-left-radius: 0 !important
}
.ss-ves{
    width: 1000px;
    margin: 150px auto;
    text-align: center
}

.search-bar {
    display: inline-block;
    /* margin-top: 30px; */
    width: 420px;
    line-height: 50px;
    border-radius: 5px;
    vertical-align: middle
    /* display: block; */
    /* margin: 0 auto; */
}
.search-bar .inp {
    float: left;
    width: 340px;
    padding: 0 20px;
    text-align: left;
    font-size: 16px;
    line-height: 50px;
    background: #f9f9f9;
    box-shadow: 0 0 15px rgba(0,0,0,0.2) inset;
    border-top-left-radius: 10px;
    border-bottom-left-radius: 10px;
}
.search-bar .inp::-webkit-input-placeholder {
    color: #999;
}
.search-bar .sub {
    float: right;
    width: 80px;
    height: 50px;
    background: url(../images/icon-search.png) no-repeat center var(--action);
    background-size: 30px;
    cursor: pointer;
    border-top-right-radius: 10px;
    border-bottom-right-radius: 10px;
    -webkit-transition: .5s;
    -o-transition: .5s;
    transition: .5s;
}
.search-bar .sub:hover {
    background-color: var(--action);
}
.index-f .button{
    width: 80px;
    height: 40px;
    display: inline-block;
    vertical-align: middle;
    /* background: url('../images/gb.png') no-repeat center center; */
    background-size: 40px 40px;
    cursor: pointer;
    margin-left: 10px;
    border-radius: 6px;
    background: #fff;
    font-size: 16px;
}
.index-f .button:hover{
    background: var(--action);
    color: #333
}